<template>
	<!-- 批量管理 -->
	<view>
		<navBar :title="'批量管理'"></navBar>
		<!-- 用户博客批量管理 -->
		<view class="blogList" v-show="type === 'blog'">
			<view v-for="(item,index) in BlogData" :key='item.blog_id' class="blogList-item">
				<view class="blogList-item-img">
					<u-image width="100%" height="180rpx" :src="item.img" :fade="true" duration="500">
						<u-loading slot="loading"></u-loading>
					</u-image>
					<!-- <u-lazy-load :height="140" :image="item.img">
					</u-lazy-load> -->
				</view>
				<view class="blogList-item-text">
					<view class="one u-line-2">
						{{item.title}}
					</view>
					<view class="two u-line-2">
						{{item.intro}}
					</view>
				</view>
				<u-checkbox size="40" v-model="item.choice"></u-checkbox>
			</view>
		</view>

		<!-- 用户视频批量管理 -->
		<view class="blogList" v-show="type === 'video'">
			<view v-for="(item2,index) in VideoData" :key='item2.video_id' class="blogList-item">
				<view class="blogList-item-img">
					<u-image width="100%" height="180rpx" :src="item2.img" :fade="true" duration="500">
						<u-loading slot="loading"></u-loading>
					</u-image>
				</view>
				<view class="blogList-item-text">
					<view class="one u-line-2">
						{{item2.video_name}}
					</view>
					<view class="two u-line-2">
						{{item2.html_text}}
					</view>
				</view>
				<u-checkbox size="40" v-model="item2.choice"></u-checkbox>
			</view>
		</view>

		<!-- 用户博客的全选删除 -->
		<view class="bottom" v-show="BlogData.length !== 0">
			<view class="bottoms">
				<view class="bottoms-left">
					<u-checkbox v-model="isAllChecked1" size="50"></u-checkbox>
				</view>
				<view class="bottoms-right">
					<u-button type="error" @click="deletePanduan">删除</u-button>
				</view>
			</view>
		</view>

		<!-- 用户视频的全选删除 -->
		<view class="bottom" v-show="VideoData.length !== 0">
			<view class="bottoms">
				<view class="bottoms-left">
					<u-checkbox v-model="isAllChecked2" size="50"></u-checkbox>
				</view>
				<view class="bottoms-right">
					<u-button type="error" @click="deletePanduan">删除</u-button>
				</view>
			</view>
		</view>

		<!-- 博客内容为空是调用的组件 -->
		<empty v-show="type === 'blog' && BlogData.length === 0 && typeNum === '0'" :pad="'400rpx'"
			:text="'您暂时还没有浏览过博客'"></empty>
		<empty v-show="type === 'blog' && BlogData.length === 0 && typeNum === '1'" :pad="'400rpx'"
			:text="'您暂时还没有点赞过博客'"></empty>
		<empty v-show="type === 'blog' && BlogData.length === 0 && typeNum === '2'" :pad="'400rpx'"
			:text="'您暂时还没有收藏过博客'"></empty>

		<!-- 视频为空是调用的组件 -->
		<empty v-show="type === 'video' && VideoData.length === 0 && typeNum === '0'" :pad="'400rpx'"
			:text="'您暂时还没有浏览过视频'"></empty>
		<empty v-show="type === 'video' && VideoData.length === 0 && typeNum === '1'" :pad="'400rpx'"
			:text="'您暂时还没有点赞过视频'"></empty>
		<empty v-show="type === 'video' && VideoData.length === 0 && typeNum === '2'" :pad="'400rpx'"
			:text="'您暂时还没有收藏过视频'"></empty>

		<u-toast ref="uToast" />


		<u-loadmore margin-bottom="50" v-show="loadmoreShow" :status="status" @loadmore="nomore" />
	</view>
</template>

<script>
	import {
		getUserBlogFoot,
		getUserBlogLike,
		getUserBlogCollection,
		deleteUserBlogCollection,
		deleteUserBlogLike,
		deleteUserBlogFoot,
		getUserVideoFoot,
		getUserVideoLike,
		getUserVideoCollection,
		deleteUserVideoFoot,
		deleteUserVideoCollection,
		deleteUserVideoLike
	} from '../../utils/user.js'

	export default {
		data() {
			return {
				//博客还是视频
				type: '',
				//点赞、浏览、收藏
				typeNum: '',
				//传参
				user_id: '',
				pageNum: 1,
				pageSize: 7,
				//博客数据
				BlogData: [],
				//视频数据
				VideoData: [],
				checked: false,

				status: 'loadmore',
				loadmoreShow: true,
				height: '',
			};
		},
		computed: {
			//全选的状态
			isAllChecked1: {
				get() {
					return this.BlogData.every(item => item.choice === true)
				},
				set(newVal) {
					this.BlogData.forEach(item => item.choice = newVal)
				}
			},
			isAllChecked2: {
				get() {
					return this.VideoData.every(item => item.choice === true)
				},
				set(newVal) {
					this.VideoData.forEach(item => item.choice = newVal)
				}
			}
		},
		methods: {
			//提示没有更多了
			nomore() {
				this.$refs.uToast.show({
					title: '没有更多了',
					type: 'success',
					duration: 500
				})
				this.status = 'nomore'
			},
			//获取数据判断是博客还是视频
			getPanduan() {
				if (this.type === 'blog') {
					(this.typeNum === '0') && this.getBlogFoot();
					(this.typeNum === '1') && this.getBlogLike();
					(this.typeNum === '2') && this.getBlogCollection();
				} else {
					(this.typeNum === '0') && this.getVideoFoot();
					(this.typeNum === '1') && this.getVideoLike();
					(this.typeNum === '2') && this.getVideoCollection();
				}
			},
			//删除数据判断是博客还是视频
			deletePanduan() {
				this.pageNum = 1
				this.pageSize = 5
				if (this.type === 'blog') {
					(this.typeNum === '0') && this.deleteBlogFoot();
					(this.typeNum === '1') && this.deleteBlogLike();
					(this.typeNum === '2') && this.deleteBlogCollection();
				}else{
					(this.typeNum === '0') && this.deleteVideoFoot();
					(this.typeNum === '1') && this.deleteVideoLike();
					(this.typeNum === '2') && this.deleteVideoCollection();
				}
			},
			//获取用户博客足迹
			async getBlogFoot() {
				let result = await getUserBlogFoot(this.user_id, this.pageNum, this.pageSize)
				if (result.code === 200) {
					this.BlogData = [...this.BlogData, ...result.data]
					this.status = 'loadmore'
					if (result.data.length === 0) {
						this.status = 'nomore'
						this.loadmoreShow = false
					}
				}
			},
			//删除用户博客足迹
			async deleteBlogFoot() {
				let arr = []
				this.BlogData.forEach(item => {
					if (item.choice === true) {
						arr.push(item.id)
					}
				})
				let str = arr.join(',')
				let result = await deleteUserBlogFoot(str, this.user_id)
				if (result.code === 200) {
					this.$refs.uToast.show({
						title: '删除成功',
						type: 'success',
						duration: 1000
					})
					this.BlogData = [];
					this.getBlogFoot()
				}else{
					this.$refs.uToast.show({
						title: '出现不知名错误',
						type: 'error',
						duration: 1000
					})
				}
			},
			//获取用户博客点赞
			async getBlogLike() {
				let result = await getUserBlogLike(this.user_id, this.pageNum, this.pageSize)
				if (result.code === 200) {
					this.BlogData = [...this.BlogData, ...result.data]
					this.status = 'loadmore'
					if (result.data.length === 0) {
						this.loadmoreShow = false
						this.status = 'nomore'
					}
				}
			},
			//删除用户博客点赞
			async deleteBlogLike() {
				let arr = []
				this.BlogData.forEach(item => {
					if (item.choice === true) {
						arr.push(item.id)
					}
				})
				let str = arr.join(',')
				let result = await deleteUserBlogLike(str, this.user_id)
				if (result.code === 200) {
					this.$refs.uToast.show({
						title: '删除成功',
						type: 'success',
						duration: 1000
					})
					this.BlogData = [];
					this.getBlogLike()
				}else{
					this.$refs.uToast.show({
						title: '出现不知名错误',
						type: 'error',
						duration: 1000
					})
				}
			},
			//获取用户博客收藏
			async getBlogCollection() {
				let result = await getUserBlogCollection(this.user_id, this.pageNum, this.pageSize)
				if (result.code === 200) {
					this.BlogData = [...this.BlogData, ...result.data]
					this.status = 'loadmore'
					if (result.data.length === 0) {
						this.loadmoreShow = false
						this.status = 'nomore'
					}
				}
			},
			//删除用户博客收藏
			async deleteBlogCollection() {
				let arr = []
				this.BlogData.forEach(item => {
					if (item.choice === true) {
						arr.push(item.id)
					}
				})
				let str = arr.join(',')
				let result = await deleteUserBlogCollection(str, this.user_id)
				if (result.code === 200) {
					this.$refs.uToast.show({
						title: '删除成功',
						type: 'success',
						duration: 1000
					})
					this.BlogData = [];
					this.getBlogCollection()
				}else{
					this.$refs.uToast.show({
						title: '出现不知名错误',
						type: 'error',
						duration: 1000
					})
				}
			},
			//获取用户视频足迹
			async getVideoFoot() {
				let result = await getUserVideoFoot(this.user_id, this.pageNum, this.pageSize)
				if (result.code === 200) {
					this.VideoData = [...this.VideoData, ...result.data]
					this.status = 'loadmore'
					if (result.data.length === 0) {
						this.status = 'nomore'
						this.loadmoreShow = false
					}
				}
			},
			//获取用户视频点赞
			async getVideoLike(){
				let result = await getUserVideoLike(this.user_id,this.pageNum,this.pageSize)
				if(result.code === 200){
					this.VideoData = [...this.VideoData, ...result.data]
					this.status = 'loadmore'
					if (result.data.length === 0) {
						this.status = 'nomore'
						this.loadmoreShow = false
					}
				}
			},
			//获取用户视频收藏
			async getVideoCollection(){
				let result = await getUserVideoCollection(this.user_id,this.pageNum,this.pageSize)
				if(result.code === 200){
					this.VideoData = [...this.VideoData, ...result.data]
					this.status = 'loadmore'
					if (result.data.length === 0) {
						this.status = 'nomore'
						this.loadmoreShow = false
					}
				}
			},
			//删除用户视频足迹
			async deleteVideoFoot(){
				let arr = []
				this.VideoData.forEach(item => {
					if (item.choice === true) {
						arr.push(item.id)
					}
				})
				let str = arr.join(',')
				let result = await deleteUserVideoFoot(str, this.user_id)
				if (result.code === 200) {
					this.$refs.uToast.show({
						title: '删除成功',
						type: 'success',
						duration: 1000
					})
					this.VideoData = [];
					this.getVideoFoot()
				}else{
					this.$refs.uToast.show({
						title: '出现不知名错误',
						type: 'error',
						duration: 1000
					})
				}
			},
			//删除用户视频点赞
			async deleteVideoLike(){
				let arr = []
				this.VideoData.forEach(item => {
					if (item.choice === true) {
						arr.push(item.id)
					}
				})
				let str = arr.join(',')
				let result = await deleteUserVideoLike(str, this.user_id)
				if (result.code === 200) {
					this.$refs.uToast.show({
						title: '删除成功',
						type: 'success',
						duration: 1000
					})
					this.VideoData = [];
					this.getVideoLike()
				}else{
					this.$refs.uToast.show({
						title: '出现不知名错误',
						type: 'error',
						duration: 1000
					})
				}
			},
			//删除用户视频收藏
			async deleteVideoCollection(){
				let arr = []
				this.VideoData.forEach(item => {
					if (item.choice === true) {
						arr.push(item.id)
					}
				})
				let str = arr.join(',')
				let result = await deleteUserVideoCollection(str, this.user_id)
				if (result.code === 200) {
					this.$refs.uToast.show({
						title: '删除成功',
						type: 'success',
						duration: 1000
					})
					this.VideoData = [];
					this.getVideoCollection()
				}else{
					this.$refs.uToast.show({
						title: '出现不知名错误',
						type: 'error',
						duration: 1000
					})
				}
			},
		},
		//下拉拉到底的时候触发的方法
		onReachBottom() {
			if (this.status === 'nomore') {
				this.loadmoreShow = false
				return
			} else {
				this.pageNum++
				this.status = 'loading'
				setTimeout(() => {
					if (this.type === 'blog') {
						(this.typeNum === '0') && this.getBlogFoot();
						(this.typeNum === '1') && this.getBlogLike();
						(this.typeNum === '2') && this.getBlogCollection();
					} else {
						(this.typeNum === '0') && this.getVideoFoot();
						(this.typeNum === '1') && this.getVideoLike();
						(this.typeNum === '2') && this.getVideoCollection();
					}
				}, 300)
			}
		},
		onLoad(option) {
			this.user_id = uni.getStorageSync('userInfo').user_id
			this.type = option.type
			this.typeNum = option.typeNum
			this.getPanduan()
			this.height = uni.getStorageInfoSync().windowHeight + 'rpx'
		}
	}
</script>

<style lang="scss" scoped>
	.blogList {
		width: 90%;
		margin: 0 auto;
		padding-top: 50rpx;

		.blogList-item {
			width: 100%;
			display: flex;
			justify-content: space-between;
			margin-bottom: 40rpx;


			.blogList-item-img {
				flex: 4.5;
				padding-right: 20rpx;

				// /deep/image {
				// 	width: 100%;
				// 	height: 130rpx;
				// }
			}

			.blogList-item-text {
				flex: 5.5;
				display: flex;
				flex-direction: column;
				justify-content: space-between;


				.one {
					font-weight: bold;
					font-size: 34rpx;
				}

				.two {
					color: #606266;
				}

			}
		}
	}

	.bottom {
		position: sticky;
		bottom: 0;
		z-index: 999;
		height: 120rpx;
		background-color: #ecf5ff;

		.bottoms {
			height: 120rpx;
			width: 90%;
			margin: 0 auto;
			justify-content: space-between;
			display: flex;

			align-items: center;
		}
	}
</style>
